<template>
  <el-form label-width="80px" style="height: 500px;overflow: hidden; " class="y jc wf ">
    <div class="x wf jc zb">
      <el-form-item label="项目名称" style="min-width: 220px">
        <!-- <sProject0 :value="form.id?form.id:form.name" @change="change(1,$event)" /> -->
        <el-input placeholder="请输入项目名称" v-model="form.name" @blur="change(1)" />
      </el-form-item>
      <el-form-item label="隶属部门" style="min-width: 220px">
        <sUserType v-model="form.userType" @change="form.userType=$event;change(3,$event)" />
      </el-form-item>
    </div>
    <el-tabs v-model="tabName" type="border-card" editable @edit="tabEdit" class="tabsFlex">
      <el-tab-pane
        v-for="(item,i) in form.info"
        :key="i"
        :label="item.name"
        class="ybl"
        :name="i.toString()"
      >
        <!-- <div class="bx3 ybl" ></div> -->
        <p1 :value="item" @change="change(0,i,$event);" />
      </el-tab-pane>
    </el-tabs>
  </el-form>
</template>
<script>
import sProject0 from "../../select/sProject0";
import sUserType from "../../select/sUserType";
import p1 from "./p1";
export default {
  components: { sProject0, sUserType, p1 },
  props: {
    value: { default: false }
  },
  watch: {
    value: {
      handler(a) {
        this.first();
      },
      deep: true
    }
  },
  data() {
    return {
      form: {},
      tabName: 0
    };
  },
  // computed() {return{}},
  created() {
    this.first();
    if (this.form.id) {
      this.title = "修改";
    } else this.title = "新增";
  },
  methods: {
    tst(a) {
      console.log(this.$cp(a));
    },
    first() {
      if (this.value) {
        this.form = this.$cp(this.value);
      }
    },
    change(a, b, c, d) {
      let t = {};
      switch (a) {
        case 0:
          // console.log(this.$cp(c));
          this.form.info[b] = c;
          break;
        case 1:
          t = this.$gd.project.getItem({ name: this.form.name });
          this.form.id = t ? t.id : 0;
          break;

        default:
          console.log(a, b, c);
          break;
      }
      this.$emit("change", this.form);
    },
    tabEdit(a, b) {
      if (b === "add") {
        this.form.info.push({name:'',items:[]});
      } else if (b === "remove") {
        this.form.info.splice(a, 1);
      }
    }
  }
};
</script>

<style scoped>
</style>
